<template>
	<view class="content" :style="pianUser.status===1||pianUser.status==='1'?'pointer-events: none':''">
		<view v-if="text1.length!==0">
					<u-notice-bar :text="text1" mode="closable"></u-notice-bar >
		</view>

		<!-- //direction="column" duration="3000"  bgColor="#fff" color="#000000" -->
		<view class="top">
			<view class="tt">
				<u-swiper :list="list3" indicator indicatorMode="line" height="150" circular></u-swiper>
			</view>
			<view style="margin-top: 5rpx;">
				<u-grid :border="false" col="4">
					<u-grid-item v-for="(listItem,listIndex) in list2" :key="listIndex"
						@click="grid(listIndex,listItem.title)" :customStyle="{width:185+'rpx',height:148+'rpx'}">
						<image :src="listItem.name" style="width: 30px;height: 30px;"></image>
						<text class="grid-text">{{listItem.title}}</text>
					</u-grid-item>
				</u-grid>
			</view>
			<u-toast ref="uToast" />
		</view>

		<view class="bottom">
			<u-sticky>
				<u-tabs :list="list1" @click="click"></u-tabs>
			</u-sticky>

			<list :loveList="loveList" :ind="index"></list>
			<u-toast ref="uToast"></u-toast>
		</view>

		<view style="" @click="uploadLove()" v-if="!(user===null||user===''||user.status===2||user.status==='2')">
			<image src="../../static/lolo.png"
				style="width: 80rpx;height:80rpx;position: fixed;right: 23rpx;bottom: 150rpx;"></image>
		</view>

	</view>

</template>

<script>
	import list from '../../components/list.vue'
	export default {
		data() {
			return {
				pianUser: uni.getStorageSync("user"),
				user: '',
				index: 0,
				total: 0,
				timer: null,
				timer2: null,
				loveList: [],
				params: {
					loginId: 0,
					pageSize: 6,
					pageNum: 1,
					top: 1,
					zanId: ''
				},
				text1: [],
				list3: [
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
					'https://cdn.uviewui.com/uview/swiper/swiper2.png',
					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
				],
				list1: [{
					name: '全部',
				}, {
					name: '最新',
				}, {
					name: '最热'
				}],
				list2: [{
						name: '/static/icon_info/53.png',
						title: '表白脱单',
						url: '/pages/picture/picture'
					},
					{
						name: '/static/icon_info/面对面沟通.png',
						title: '校友闲聊',
						url: '/pages/account/account'
					},
					{
						name: '/static/icon_info/失物招领.png',
						title: '失物招领',
						url: '/pagesa/FrentsSi/FrentsSi'
					},
					{
						name: '/static/icon_info/多人游戏1.png',
						title: '游戏搭子',
						url: '/pagesa/usesrinfo/usesrinfo'
					}, {
						name: '/static/icon_info/二手市场.png',
						title: '二手市场',
						url: '/pages/picture/picture'
					},
					{
						name: '/static/icon_info/迎接新生服.png',
						title: '新生墙',
						url: '/pages/account/account'
					},
					{
						name: '/static/icon_info/招聘会-选中.png',
						title: '兼职发布',
						url: '/pagesa/FrentsSi/FrentsSi'
					},
					{
						name: '/static/icon_info/Title_考研公共课.png',
						title: '考研交流',
						url: '/pagesa/usesrinfo/usesrinfo'
					}
				]
			}
		},
		onShareAppMessage(res) { //发送给朋友
			return {
				title: this.title,
				imageUrl: this.thumb,
			}
		},
		onShareTimeline(res) { //分享到朋友圈
			return {
				title: this.title,
				imageUrl: this.thumb,
			}
		},
		onLoad() {
			this.getnews()
			if (this.timer) {
				clearTimeout(this.timer); // 清除定时器  
			}
			uni.showLoading({
				title: '加载中'
			});
			this.getList()
			this.timer2 = setTimeout(() => {
				uni.hideLoading();
			}, 1200)

		},
		onUnload() {
			console.log(321123)
			if (this.timer2) {
				clearTimeout(this.timer2); // 清除定时器  
			}
		},
		onPullDownRefresh() {
			uni.showLoading({
				title: '加载中'
			});
			this.params.pageNum = 1
			this.getList()
			this.timer = setTimeout(() => {
				uni.stopPullDownRefresh()
				uni.hideLoading();
			}, 1000)
		},
		onReachBottom() {
			this.getBottom()
		},
		methods: {
			async getnews() {
				const res = await this.$myRuquest({
					url: '/font/messageList?userId='+this.pianUser.id
				})
				if(res.data.data.length>0){
					var content=res.data.data.map(item=>item.content)
					this.text1=content
				}
			},
			uploadLove() {
				uni.navigateTo({
					url: "/pagesa/upLoadLove/upLoadLove"
				})
			},
			grid(index, title) {
				var type = Number(index) + 1
				uni.navigateTo({
					url: type === 5 ? '/pagesa/twoHeadMarkList/twoHeadMarkList' :
						'/pagesa/commonList/commonList?type=' + type + '&title=' + title
				})
			},
			async getBottom() {
				const that = this
				if (this.loveList.length < this.total) {
					this.params.pageNum++
					uni.showLoading({
						title: '加载中'
					});
					uni.request({
						url: that.$baseurl + "/font/list",
						method: 'GET',
						data: that.params,
						success(res) {
							that.loveList = [...that.loveList, ...res.data.rows]
						}
					})
					uni.hideLoading();
				} else {
					this.$refs.uToast.show({
						type: 'default',
						title: '默认主题',
						message: "到底了...",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
					})
				}
			},
			async getList() {
				this.user = uni.getStorageSync("loginUser")
				if (this.user !== '' && this.user !== null && this.user !== undefined) {
					this.params.loginId = this.user.id
				}
				const res = await this.$myRuquest({
					url: '/font/list',
					data: this.params
				})
				this.loveList = res.data.rows
				this.total = res.data.total
			},
			click(item) {
				this.index = item.index
				if (item.index === 0) {
					this.params.pageNum = 1
					this.params.top = 1
					this.params.zanId = ''
					this.getList()
				} else if (item.index === 1) {
					this.params.pageNum = 1
					this.params.top = ''
					this.params.zanId = ''
					this.getList()
				} else {
					this.params.pageNum = 1
					this.params.top = ''
					this.params.zanId = 1
					this.getList()
				}
			}
		},
		components: {
			"list": list,
		},
	}
</script>

<style lang="scss">
	.grid-text {
		font-size: 14px;
		color: #191a1b;
		padding: 10rpx 0 20rpx 0rpx;
		/* #ifndef APP-PLUS */
		box-sizing: border-box;
		/* #endif */
	}

	.content {
		background-color: #f1f1f1;

		.top {
			background-color: #ffffff;
			border-radius: 30rpx;

			.tt {
				margin-left: 11rpx;
				margin-right: 11rpx;
			}

		}

		.bottom {
			margin-top: 5rpx;
		}
	}
</style>